<route lang="json5" type="entryTemplate">
{
  layout: 'none',
  style: {
    // 'custom' 表示开启自定义导航栏，默认 'default'
    navigationStyle: 'default',
    navigationBarTitleText: '商户服务费充值',
    navigationBarBackgroundColor: '#3287e1',
    navigationBarTextStyle:'white',
    enablePullDownRefresh:false,
    onReachBottomDistance:50,
  },
}
</route>

<script setup lang="ts">
function back() {
  uni.navigateBack()
}
</script>

<template>
  <view class="pages">
    <view class="logo">
      <wd-img :width="80" :height="80" round src="https://wap.mch.yuntbq.com/static/img/logo.png" mode="scaleToFill" />
    </view>
    <view class="cz-title">
      商户服务费充值
    </view>
    <view class="mt-50rpx flex justify-center">
      <view class="box">
        <view>商家账号：<text>mch1000</text></view>
        <view>
          当前余额：￥<text class="text-#07C160 font-bold">
            108.577
          </text>元
        </view>
        <view>
          充值余额：￥<text class="text-#EE0A24 font-bold">
            100
          </text>元
        </view>
      </view>
    </view>
    <view class="btn-group">
      <wd-button size="small" block custom-class="btn-pay">
        服务费充值
      </wd-button>
      <wd-button size="small" type="info" plain block @click="back">
        返回 商户
      </wd-button>
    </view>
  </view>
</template>

<style lang="scss" scoped>
.pages {
  padding: 30rpx;
}
.logo {
  margin: 60rpx 0 30rpx;
  text-align: center;
}
.cz-title {
  text-align: center;
  font-size: 40rpx;
  color: #07C160;
  font-weight: bold;
}
.box{
    font-size: 32rpx;
    line-height: 60rpx;
    color: #000;
}
.btn-group{
    width: 70%;
    margin: 60rpx auto 0;
}
:deep(.btn-pay) {
  background-color: #07C160 !important;
  margin-bottom: 20rpx !important;
}
</style>
